import { ElTableColumn, ElImage } from 'element-plus'
import {createVideoViewer} from "@/components/VideoPlayer";
import { BaseButton } from '@/components/Button'
import { Icon } from '@/components/Icon'
import {TableData} from "@/api/table/types";

export const renderPreview = (url: string, field: string, imagePreview, videoPreview) => {
    // const { imagePreview, videoPreview } = unref(getProps)

    return (
        <div class="flex items-center">
            {imagePreview.includes(field) ? (
                <ElImage
                    src={url}
                    fit="cover"
                    class="w-[100%]"
                    lazy
                    preview-src-list={[url]}
                    preview-teleported
                />
            ) : videoPreview.includes(field) ? (
                <BaseButton
                    type="primary"
                    icon={<Icon icon="ep:video-play" />}
                    onClick={() => {
                        createVideoViewer({
                            url
                        })
                    }}
                >
                    预览
                </BaseButton>
            ) : null}
        </div>
    )
}

export const IdxTableColumn = () => {
    return (
        <ElTableColumn
            type="index"
            headerAlign="left"
            label="#"
            fixed="left"
            width="40"
        ></ElTableColumn>
    )
}

export const SelTableConlumn = () => {
    return (
        <ElTableColumn
            type="selection"
            align="left"
            headerAlign="left"
            fixed="left"
            width="20"
        ></ElTableColumn>
    )
}

import Vrouter from "@/router"
const mRouter = Vrouter;
import { uriQueryParsingToJson, jsonToUrlParam } from '@/utils/index'
import { useTagsViewStoreWithOut } from '@/store/modules/tagsView'
const useTagsViewStoreWithOut2 = useTagsViewStoreWithOut()

export const  actionPush = (urlStr: string, row: Object) => {
    // /example/example-edit?id=$id
    const {url, json} = uriQueryParsingToJson(urlStr, row);
    mRouter.push(url + '?' + jsonToUrlParam(json))
    // tagViewStore.add(`/example/example-${type}`, {id:`${row.id}`})
    useTagsViewStoreWithOut2.add(url, json)
}

export const getColumn = (row: TableData, v: Object) =>{
    if(!v.field){
        return '';
    }
    const txt = row[v.field] || ''
    if(!txt){
        return '';
    }

    if(v.edit){
        return (<span class="table-col-link" onClick={() => actionPush(v.edit, row)}>{txt}</span>)
    }
    return  txt
}
